  <div class="f-engMain-content">
	 <div class="workTabSwitch">
            <ul>
            	<li class="workTabSwitchFri">选择:</li>
                <li ng-click="WorkAll()" class="workAllFir" ng-class="{'workColor':current == false}">全部</li>
                <li  ng-repeat="item in worktab track by $index" ng-class="{'workColor':current== (item.tcId)}"  ng-bind="item.tcName" id="{{ item.tcId }}"  ng-click="switchData(item)"></li>
            </ul>
        </div>
   </div>
<div class="workBox">
    <div class="workFlex">

</div>
    <div class="workSkillCon">
        <div class="workSkillConTop">
            <h1>共<span ng-bind="totalItem"></span>个技能</h1>
            <div class="workSort">
                <a  ng-click="DateColor()" class="dateUp-{{ isDisabled }}"  href="javascript:;">
                    <span>时间</span>
                </a>
                <a  ng-click="peopleColor()" class="peopleNum-{{ peopecolor }}" href="javascript:;">
                    <span>人气</span>
                </a>
            </div>
        </div>
        <div class="workAll">
            <ul>
                <li ng-repeat="item in ConList" class="workListCon">
            
                        <div class="workImg" ng-click="linkSwitch(item)">
                            <img src="them/imag/noSrc.png" ng-src="{{ item.previewPath }}" alt="..." />
                        </div>
                        <div class="workTit" >
                            <h1 ng-bind="item.title" ng-click="linkSwitch(item)"></h1>

                            <div class="labelist">
                                    <span ng-repeat="item3 in item.labelList" ng-click="linkSearch(item3.labelName)" ng-bind="item3.labelName">
                                    </span>
                            </div>
                            <ul class="workUl">
                                <li ng-repeat="item2 in item.skillFileVoList" ng-click="linkfile(item2.fileId)" ng-bind="item2.name" id="{{ item2.skillId }}"></li>
                            </ul>
                        </div>
                        <div class="workTime" ng-bind="item.createTime|dateFilter">
                        </div>
              
                </li>
                <no-content conf-type="'search'" conf-content="'对不起 没有您要找的技能'" ng-if="ConList.length == 0"></no-content>
            </ul>
            <div class="workListBottom">
                <ui-pagination  ng-if="paginationConf" conf="paginationConf"></ui-pagination>
            </div>
        </div>
    </div>
    <div class="workSamllList">
        <div class="DowdRank">
            <h1>下载排行</h1>
            <div class="DowdCon">
                <dl ng-repeat="item in RankCon track by $index">
                    <dt>
                        <span ng-bind="($index)+1" ng-style="content[$index]"></span>
                    <p></p>
                    </dt>
                    <dd>
                        <a id="{{ item.skillId }}" ng-click="goTo(item)" ng-bind="item.title"></a>
                        <span ng-bind="item.downloadCount"></span>
                    </dd>
                </dl>
            </div>
        </div>

    </div>
    </div>
</div>
  <style>
      .workBox {
          width:100%;
          background: #f8f8f8;
          overflow: hidden;
      }
      .workFlex {
          width:1200px;
          height:auto;
          margin:0 auto;
          overflow: hidden;
          margin-bottom:30px;
      }
      .workTabSwitch {
          width:100%;
          height:92px;
      }
      .workTabSwitch ul li {
          cursor: pointer;
          margin-top:30px;
          float: left;
          padding: 0 20px 0 20px ;
          height:30px;
          line-height: 30px;
          margin-right:20px;
          color: #666;
      }
      .workTabSwitch ul li.workColor {
          color: #31a3ff;
      }
      .workSkillCon {
          width:870px;
          clear: both;
          background-color: #fff;
          float: left;
      }
      .workSkillConTop {
          width:100%;
          height:55px;
          line-height:55px;
          border-bottom:1px solid #ddd;
      }
      .workSkillConTop h1 {
          float: left;
          padding-left:20px;
          font-size:12px;
      }
      .workSkillConTop h1 span{
          color: #30a3ff;
          font-size: 18px;
          margin-left: 5px;
          margin-right: 6px;
      }
      .workSkillConTop .workSort {
          float: right;
          padding-right:30px;
      }
      .workSkillConTop .workSort a {
          display: inline-block;
      }
      .workSkillConTop .workSort a.dateUp-true,.workSkillConTop .workSort a.dateUp-false {
          border-right: 1px #ddd solid;
          padding-right:35px;
          background: url("them/imgs/bottom.png") no-repeat 29px 23px;

      }
      .workSkillConTop .workSort a.dateUp-true{
          padding-right:35px;
          color:rgb(48, 163, 255);
          background: url("them/imag/top-blue-arrow.png") no-repeat 29px 23px;
      }
      .workSkillConTop .workSort a.peopleNum-false {
          padding-left: 15px;
          padding-right:20px;
          color: #000;
          background: url("them/imgs/bottom.png") no-repeat 44px 23px;
      }
      .workSkillConTop .workSort a.peopleNum-true{
          padding-left: 15px;
          padding-right:20px;
          color:rgb(48, 163, 255);
          background: url("them/imag/top-blue-arrow.png") no-repeat 44px 23px;
      }
      .workAll{
          clear: both;
          background-color: #fff;
          overflow: hidden;
      }
      .workAll ul li.workListCon {
          width:870px;
          height:170px;
          border-bottom:1px solid #ddd;
      }
      .workAll ul li:hover{
          background: #f8f8f8;
      }
      .workAll ul li .workImg,.workTit,.workNotes,.workTime {
          margin:28px 0 0 20px;
          float: left;
      }
      .workImg,.workImg img {
          width:211px;
          height:132px;
      }
      .workTit {
          margin-left:30px;
          width:228px;
          height:102px;
          position: relative;
      }
      .workTit .labelist {
          width: 100%;
          height: 20px;
          margin-top: 10px;
      }
      .workTit .labelist span{
          display: block;
          float: left;
          height: 100%;
          border: 1px solid #ddd;
          color: #ddd;
          margin-right: 10px;
          padding-left: 10px;
          padding-right: 10px;
      }
      .workTit .labelist span:hover{
      	cursor: pointer;
      }
      .workTit .labelist span:nth-child(1){
          border: 1px solid #bdd2f2;
          color:#bdd2f2;
      }
      .workTit ul.workUl {
          position: absolute;
          left: 0;
          top: 35px;
          width: 662px;
      }
      .workTit ul.workUl li {
          float: left;
          width: 272px;
          margin-bottom: 6px;
          white-space:nowrap;
          overflow:hidden;
          text-overflow:ellipsis;
          cursor: pointer;
      }
     
      .workTit h1 {
          font-size:16px;
      }
      .workTit h1:hover{
      	cursor: pointer;
      }
      .workTit ul {
          margin-top:20px;
      }
      .workTit ul li {
          height:20px;
          width:100%;
          font-size:12px;
          color: #666;
          background: url("them/imgs/zfxs.png") no-repeat 0 10px;
          padding-left:14px;
      }
      .workNotes {
          margin-left:20px;
          width:216px;
          height:102px;
      }
      .workNotes h2 {
          height:18px;
          margin:0;
          padding:0;
      }
      .workNotes h2 ul li {
          margin-right:10px;
          padding-left:19px;
          padding-right:19px;
          height:18px;
          border:1px solid #ddd;
          font-size:12px;
          font-weight:normal;
          float: left;
          text-align: center;
          line-height:18px;
      }
      .workNotes h2 ul li.couseColor {
          border:1px solid #96b9e9;
          color: #96b9e9;
      }
      .workNotes ul.noteCon {
          clear: both;
          margin-top:15px;
      }
      .workNotes ul.noteCon li {
          height:20px;
          width:100%;
          font-size:12px;
          color: #666;
          background: url("them/imgs/zfxs.png") no-repeat 0 10px;
          padding-left:14px;
      }
      .workTime {
          float: right;
          margin-right:30px;
      }
      .workSamllList {
          float: right;
          width:310px;
          overflow: hidden;
      }
      /*热门回答*/
      .hotApply {
          width:100%;
          background: #fff;
          height:587px;
      }
      .hotSearch h1,.DowdRank h1,.hotApply h1 {
          width: 265px;
          height: 53px;
          line-height: 53px;
          border-bottom: 1px #ddd solid;
          padding-left: 43px;
          overflow: hidden;
          background: url(them/imgs/zfx.png)14px 21px no-repeat;
          background-size: 14px 14px;
          font-size: 16px;
          color: #010101;
      }
      .hotApplyCon {
          overflow: hidden;
      }
      .hotApply dl {
          width:280px;
          height:38px;
          margin:20px 0 0 15px;
      }
      .hotApply dl dt {
          margin-right:20px;
          width:36px;
          height:36px;
          float: left;
          text-align: center;
      }
      .hotApply dl dt span {
          display: block;
      }
      .hotApply dl dd p {
          margin-bottom:10px;
      }
      .hotApply dl dd span {
          padding-right:146px;
          color: #bbb;
      }
      .hotApply dl dd b{
          font-weight:normal;
          color: #bbb;
      }
      .hotrequ {
          clear: both;
          width:102px;
          height:23px;
          margin:0 auto;
          margin-top:20px;
          text-align: center;
          line-height:23px;
          position: relative;
      }
      .hotrequ span {
          position: absolute;
          top:13px;
          display: block;
          width:100%;
          height:10px;
          border:1px solid #30a3ff;
          border-top:none;
      }
      .DowdRank {
          width:100%;
          height:570px;

          background: #fff;
          overflow: hidden;
      }
      .DowdCon {
          width:280px;
          overflow: hidden;
          margin:22px 0 0 15px;
      }
      .DowdCon dl {
          width:280px;
          height:54px;
          margin-bottom:8px;
      }
      .DowdCon dl dt {
          font-size:14px;
          width:25px;
          height:20px;
          background: #fff;
          z-index: 2;
          float: left;

      }
      .DowdCon dl dt p {
          width:0px;
          height:33px;
          border-right:1px solid #ddd;
          margin-left:3px;
      }
      .DowdCon dl dd {
          width:256px;
      }
      .DowdCon dl dd span {
          display: block;
          width:47px;
          height:13px;
          background:url("them/imgs/dowdIcon.jpg") no-repeat 0 2px;
          float: right;
          padding-left:14px;
      }
      .hotSearch {
          width:100%;
          height:170px;
          background: #fff;
          margin-top:30px;
      }
      .hotSearch ul {
          width:280px;
          margin-left:15px;
          margin-top:20px;
      }
      .hotSearch ul li {
          float: left;
          color: #30a3ff;
          margin:0 9px 6px 0;
          width:82px;
          height:37px;
          text-align: center;
          line-height:37px;
          border:1px solid #ddd;
          border-radius: 36%;
          _background: url("them/imgs/searchIcon.jpg") no-repeat;
      }
      /*字体一行一个颜色。变态*/

  </style>